<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="shortcut icon" href="">
    <title>模板</title>
    <style type="text/css">
        body {
            background-color: #eccc68;
        }

        canvas {
            width: 400px;
            height: 300px;
            border: 1px solid black;
        }
    </style>
</head>

<body>
    <h1>模板</h1>
    <script src="two.js" type="text/javascript"></script>
    <script type="text/javascript">
        const WIDTH = 800, HEIGHT = 600
        let canvas = document.createElement('canvas')
        canvas.width = WIDTH
        canvas.height = HEIGHT
        canvas.style.width = (canvas.width / 2) + "px"
        canvas.style.height = (canvas.height / 2) + "px"
        canvas.style.border = "1px solid black"
        let ctx = canvas.getContext('2d')
        document.querySelector('body').appendChild(canvas)

        let info = document.createElement('canvas')
        info.width = WIDTH / 2
        info.height = HEIGHT
        info.style.width = (info.width / 2) + "px"
        info.style.height = (info.height / 2) + "px"
        info.style.border = "1px solid black"
        let info_ctx = info.getContext('2d')
        document.querySelector('body').appendChild(info)
        function randomv(min = 180, max = 360) {
            let range = min - ~~(Math.random() * max)
            return range > 0 ? range + min : range - min
        }
	    new Point()
        let render = new Render()
        render.setSize(400, 300)
        render.setPixelRatio(2)
        render.setAnimationLoop(animation)
        document.querySelector('body').appendChild(render.domElement)

        function animation() {
            // console.log(1)
        }


    </script>
</body>

</html>
